<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="../css/app.css" />
		<style type="text/css">
			.mui-input-group:before {
				background-color: #fff;
			}
			.mui-input-group:after {
				background-color: #fff;
			}
			.mui-input-row {
				position: relative;
				padding: 10px 15px;
			}
			.mui-btn-block {
				padding: 10px 0;
			}
			.mui-input-group .mui-button-row {
				/*height: 30px;*/
				
				position: relative;
				padding: 10px 30px;
			}
			.mui-input-group .mui-input-row:after {
				left: 30px;
				right: 30px;
			}
			.mui-input-group .mui-input-row:before {
				left: 30px;
				right: 30px;
			}
			.forgot {
				margin-top: 45px;
			}
			a {
				color: #f6661f;
			}
			.mui-content {
				background-color: #fff;
			}
			input[type="password"] {
				border: none;
			}
			.mui-btn-negative {
				background-color: #30a4ed;
				border: 1px solid #30a4ed;
				border-radius: 0px;
			}
			.mui-input-group {
				height: 100px;
			}
			.mui-input-group .mui-input-row input[type=text] {
				width: 60%;
				float: left;
			}
			.mui-input-row input~p {
				line-height: 40px;
				float: right;
				margin-right: 15px;
			}
			#getverifycode {
				/*padding: 4px 6px;*/
			}
			.mui-input-group .mui-input-row {
				height: 60px;
			}
		</style>
	</head>

	<body style="background-color: #fff;">
		<header class="mui-bar mui-bar-nav" id="header">
			<a class="mui-icon mui-pull-lefty" onclick="api.closeWin()"><img src="../image/cancle.png" style="height: 24px;" /></a>
			<h1 class="mui-title">注册账户</h1>
			<!--<h1 class="header-input"><input type="search"></h1>-->
		</header>
		<div class="mui-content" style="margin-top: 40px;height: 100%;background-color: #fff;">
			<div class="mui-input-group" id="signinform">
				<div class="mui-input-row">
					<input type="text" class="mui-input-clear" id="username" autofocus="autofocus" placeholder="用户名">
				</div>
				<div class="mui-input-row">
					<input type="password" id="password" class="mui-input-clear" placeholder="密码">
				</div>
				<div class="mui-input-row">
					<input type="password" id="confirmpass" class="mui-input-clear" placeholder="重输密码">
				</div>
				<!--<div class="mui-input-row">
					<input type="text" class="mui-input-clear" id="phone" placeholder="输入手机号码">
					<p>
						<button id="getverifycode" class="mui-btn mui-btn-negative">获取验证码</button>
					</p>
				</div>
				<div class="mui-input-row">
					<input type="text" class="mui-input-clear" id="verifycode" placeholder="短信验证码">
				</div>-->
				<div class="mui-input-row">
					<input type="text" class="mui-input-clear" id="email" placeholder="输入邮箱">
				</div>
				<br/>
				<div class="mui-button-row">
					<button class="mui-btn mui-btn-negative mui-btn-block" id="signin">注册</button>
				</div>
			</div>
		</div>
		<script src="../script/mui.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../script/api.js" type="text/javascript" charset="utf-8"></script>
		<script src="../script/app.js" type="text/javascript" charset="utf-8"></script>
		<script src="../script/md5.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			var second = 60;

			function checkMobile(sMobile) {
				if (!(/^1[3|4|5|8][0-9]\d{4,8}$/.test(sMobile))) {
					alert("手机号码格式错误!");
					document.getElementById('phone').focus();
					return false;
				} else {
					return true;
				}
			}

			function change() {
				second--;
				if (second == 0) {
					document.getElementById("getverifycode").innerHTML = "获取验证码";
					document.getElementById("getverifycode").disabled = "";
					second = 60;
				} else if (second > 0) {
					document.getElementById("second").innerHTML = second;
					timer = setTimeout('change()', 1000); //调用自身实现
				} else {
					//					clearTimeout(timer);
				}
				return second;
			}

			function verifyCodeInterval() {
				document.getElementById("getverifycode").disabled = "true";
				document.getElementById("getverifycode").innerHTML = "<span id='second'></span>s";
				change();
			}
//			document.getElementById("getverifycode").addEventListener('click', function() {
//				var mobile = document.getElementById("phone").value;
//				if (checkMobile(mobile)) {
//					//					alert("验证码发送成功!");
//					//					verifyCodeInterval();
//					var url = MYAPP.webroot + "/mobile/index.php?act=login&op=sendmcheck";
//					var data = {
//						mobile: mobile
//					}
//					api.ajax({
//						url: url,
//						method: 'post',
//						timeout: 30,
//						data: {
//							values: data
//						},
//						dataType: 'text',
//						returnAll: false
//					}, function(ret, err) {
//						if (ret == "no") {
//							api.toast({
//								msg: "号码格式错误或已被注册！"
//							});
//						} else if (ret == "error") {
//							api.toast({
//								msg: "验证码发送失败！"
//							});
//						} else {
//							alert("验证码已发送!");
//							verifyCodeInterval();
//						};
//					});
//				}
//			});
			apiready = function() {
				var header = $api.byId('header');
				$api.fixIos7Bar(header);
				var cellphone = document.getElementById("cellphone");
				var username = document.getElementById("username");
				document.getElementById("signin").addEventListener("tap", function() {
					var myusername = username.value;
					//					alert(myusername);
					localStorage.setItem("username", myusername);
					var mypassword = document.getElementById("password").value;
					var confirmpass = document.getElementById("confirmpass").value;
//					var phone = document.getElementById("phone").value;
					var email = document.getElementById("email").value;
//					var telcode = document.getElementById("verifycode").value;
//					if (email == "") {
//						email = phone + "@139.com";
//					}
					if (myusername === "" || !myusername) {
						api.toast({
							msg: '用户名不能为空哦！',
							location: 'middle'
						});
						username.setAttribute("autofocus", "autofocus");
						return false;
					}
					if (mypassword == "" || mypassword == "d41d8cd98f00b204e9800998ecf8427e" || !mypassword) {
						api.toast({
							msg: '密码不能为空哦！',
							location: 'middle'
						});
						return false;
					}
					if (confirmpass == "" || confirmpass == "d41d8cd98f00b204e9800998ecf8427e" || !confirmpass) {
						api.toast({
							msg: '要再输一遍密码哦',
							location: 'middle'
						});
						return false;
					}
					if (mypassword != confirmpass) {
						api.toast({
							msg: '两次密码输入不一致哦!',
							location: 'middle'
						});
						return false;
					}
//					if (telcode == "") {
//						api.toast({
//							msg: '请输入短信验证码！',
//							location: 'middle'
//						});
//						return false;
//					}
					api.showProgress({
						style: 'default',
						animationType: 'fade',
						text: '正在提交中…',
						modal: false
					});
					var url = MYAPP.webroot + "/api/index.php/Home/User/adduser/";
					var success = function(response) {
						if (response.code == "200") {
							//							api.execScript({
							//							   frameName: 'member',
							//							   script: 'showlogout();'
							//							});
							if (response.error) {
								api.toast({
									msg: response.error,
									location: 'middle'
								});
								api.hideProgress();
								return false;
							} else {
								var uid = response.uid;
								localStorage.setItem("uid", uid);
								api.hideProgress();
								api.toast({
									msg: '注册成功！请登录',
									location: 'middle',
									duration: 1000
								});
								setTimeout("api.closeWin()", 2000);
							}
						} else {
							api.toast({
								msg: '注册失败！',
								location: 'middle'
							});
							api.hideProgress();
						}
					};
					var data = {
						"username": myusername,
						"password": mypassword,
						"email": email
					};
					api.ajax({
						url: url,
						method: 'post',
						timeout: 30,
						data: {
							values: data
						},
						dataType: 'json',
						returnAll: false
					}, function(ret, err) {
						if (ret) {
							success(ret);
							return true;
						} else {
							api.alert({
								msg: ('错误码：' + err.code + '；错误信息：' + err.msg + '网络状态码：' + err.statusCode)
							});
						};
					});
				});
			};
		</script>
	</body>

</html>